<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>MPG.GalleryController</title>
		<link rel="stylesheet" type="text/css" href="../public/css/oocss/all.css" media="screen" />
		<style type="text/css">
			.page { height: 100px; }
		</style>
		<script type="text/javascript" src="../public/js/libraries/mootools-core.js"></script>
		<script type="text/javascript" src="../public/js/libraries/mootools-more.js"></script>
		<script type="text/javascript" src="../public/js/libraries/powertools.js"></script>
		<script type="text/javascript" src="../source/mpg.elements.js"></script>
		<script type="text/javascript" src="../source/mpg.spinner.js"></script>
		<script type="text/javascript" src="../source/mpg.igallery.js"></script>
		<script type="text/javascript" src="../source/mpg.gallery-controller.js"></script>
		<script type="text/javascript" src="js/mpg.gallery-controller.js"></script>
	</head>
	<body>
	<div id="gallery" class="gallery">
		<div class="page">
			<h2>Page1</h2>
		</div>
		<div class="page">
			<h2>Page2</h2>
		</div>
		<div class="page">
			<h2>Page3</h2>
		</div>
		<div class="page">
			<h2>Page4</h2>
		</div>
		</div>

		<p id="current"></p>
		<p><input id="first" type="button" name="first" value="first" /> <input id="prev" type="button" name="prev" value="prev" /> <input id="next" type="button" name="next" value="next" /> <input id="last" type="button" name="last" value="last" /></p>
	</body>
</html>